import React from "react";
import '../other/index.css';

function Method() {
    return (
        <div>
            <ol>
                <li className="BiaoTi">useNavigate</li>
                <p className="p_content" >
                    钩子函数，可用于跳转<br />
                    navigate = useNavigate()<br />
                    navigate('url')
                </p>

                <li className="BiaoTi">navigate</li>
                <p className="p_content" >
                    navigate('url'),跳转到url（累加，包括之前的路由）,repalce为true时，路由替换<br />
                    navigate('url',[replace:true])   --[]应该使用大括号
                </p>

                <li className="BiaoTi">useSearchParams</li>
                <p className="p_content" >
                    跳转时navigate('url?id=123')<br />
                    const searchParams = useSearchParams()<br />
                    获取id<br />
                    const id = searchParams.get(id)
                </p>

                <li className="BiaoTi">useParams</li>
                <p className="p_content" >
                    跳转时navigate('/url/123')<br />
                    const params = useParams()<br />
                    获取id<br />
                    const id = params.id<br />
                    注意：需要在Route定义时加上参数，例如 path='url/:id'
                </p>

                <li className="BiaoTi">useLocation</li>
                <p className="p_content" >
                    const location = useLocation()<br />
                    const pathname = params.pathname<br />
                    pathname就是当前的路径，如 '/router/method'
                </p>
            </ol>
        </div >
    )
}

export default Method